<template>
  <!-- 测试 -->
  <!-- <XtxSkeleton width="100" height="100" bg="red" /> -->
  <!-- <p>{{ load }}</p>
  <input type="text" v-ilazy="load" /> -->
  <div class="container">
    <!-- 分类 -->
    <HomeCategory />
    <!-- 轮播 -->
    <HomeBanner />
    <!-- 新鲜好物 -->
    <HomeNew />
    <!-- 人气推荐 -->
    <HomeRecom />
    <!-- 楼层 -->
    <HomeProduct />
  </div>
</template>

<script>
// 导入分类和轮播
import HomeCategory from './components/home-category.vue'
import HomeBanner from './components/home-banner.vue'
// 导入骨架组件
// import Skeleton from '@/components/Skeleton'
import HomeNew from './components/home-new.vue'
import HomeRecom from './components/home-recom.vue'
import HomeProduct from './components/home-product.vue'

export default {
  name: 'xtx-home-page',
  components: {
    HomeCategory,
    HomeBanner,
    HomeNew,
    HomeRecom,
    HomeProduct
    // Skeleton
  }
}
</script>

<style scoped lang='less'>
// 手动导入
// @import "~@/styles/variables.less";
.test {
  border: 2px solid @xtxColor;
}
</style>
